<!doctype html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<title>jQuery UI Resizable Test Suite</title>

	<script src="../../../external/requirejs/require.js"></script>
	<script src="../../lib/css.js" data-modules="core resizable"></script>
	<script src="../../lib/bootstrap.js" data-widget="resizable"></script>
	<style>
	#container {
		width: 300px;
		height: 200px;
	}
	#resizable1 {
		background: green;
		height: 100px;
		width: 100px;
	}
	#resizable2 {
		height: 100px;
		width: 100px;
	}
	#container2 {
		position: relative;
		width: 400px;
		height: 400px;
		margin: 30px 0 0 30px;
	}
	#parent {
		position: relative;
		width: 300px;
		height: 300px;
	}
	#child {
		position: relative;
		width: 100px;
		height: 100px;
	}
	</style>
</head>
<body>

<div id="qunit"></div>
<div id="qunit-fixture">

<div id="container">
	<div id="resizable1">I'm a resizable.</div>
	<div id="resizer1" class="ui-resizable-handle ui-resizable-s"></div>
</div>

<div id="container2">
	<div id="parent">
		<div id="child">I'm a resizable.</div>
	</div>
</div>
<img src="images/test.jpg" id="resizable2" alt="solid gray">

</div>
</body>
</html>
